<%= render :partial => "home/sidebar" %>
<div class="col-lg-9">

  <h3 style="margin-top:0;">Public Lab contributors near <% if current_user %>you<% else %><%= params[:q] %><% end %></h3>

  <form action="" class="form">
    <input class="input search-query" type="text" name="q" placeholder="Search for a place"/>
    <button class="btn btn-primary" type="submit">Search</button>
  </form>

  <div class="col-lg-12" style="margin-left:0;height:400px;" id="map"></div>

  <script>
    var map = L.map('map').setView([<%= current_user.lat %>,<%= current_user.lon %>], 8);
    L.tileLayer('https://api.mapbox.com/styles/v1/jywarren/ckj06ujnc1nmi19nuelh46pr9/tiles/{z}/{x}/{y}?access_token=pk.eyJ1Ijoianl3YXJyZW4iLCJhIjoiVzVZcGg3NCJ9.BJ6ArUPuTs1JT9Ssu3K8ig', {
      tileSize: 512,
      zoomOffset: -1,
      attribution: '© <a href="https://apps.mapbox.com/feedback/">Mapbox</a> © <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a>'
    }).addTo(map);


    <% if @users %>
    <% @users.each do |user| %>
      L.marker([<%= user.lat %>, <%= user.lon %>]).addTo(map).bindPopup("<a href='/profile/<%= user.name %>'><%= user.name %></a>");
    <% end %>
    <% end %>
  </script>

</div>

